<template>
    <div>
      <div class="hot-title">周末去哪玩</div>
       <div  v-for="item in weblist" :key="item.id" v-if="weblist && weblist.length">
         <div class="product-imgcontainer">
           <img :src="item.imgUrl" alt="">
         </div>
         <div class="mp-product-info">
           <p class="product-name">{{item.title}}</p>
           <p class="product-desc">{{item.desc}}</p>
         </div>
       </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {}
        },
       props:{
          weblist:{
            type:Array,
            default:[]
          }
       }
    }
</script>

<style lang="stylus">
  .hot-title
    height 40px
    line-height 40px
    font-size 15px
    padding-left 10px
  .product-imgcontainer
    width:100%
    img
      width:100%
  .mp-product-info
    padding:5px 4px 5px 8px
    .product-name
      font-size 15px
      margin-bottom 4px
      color #7e8c8d
    .product-desc
      font-size 13px

</style>
